<template>
    <div>
        <el-row>
            <el-col>
                <el-input v-model="stockGoodsDTO.code" placeholder="请输入商品编码" style="width: 200px;"></el-input>
                <el-select v-model="stockGoodsDTO.material" placeholder="请选择物料" @change="changeMaterial()">
                    <el-option
                    v-for="item in baseVO.materials"
                    :key="item.type"
                    :label="item.type"
                    :value="item.type">
                    </el-option>
                </el-select>
                <el-select v-model="stockGoodsDTO.purity" placeholder="请选择品质">
                    <el-option
                    v-for="item in purities"
                    :key="item.purity"
                    :label="item.purity"
                    :value="item.purity">
                    </el-option>
                </el-select>
                <el-select v-model="stockGoodsDTO.category" placeholder="请选择品类">
                    <el-option
                    v-for="item in baseVO.categories"
                    :key="item.type"
                    :label="item.type"
                    :value="item.type">
                    </el-option>
                </el-select>
                <el-button @click="searchCondition()" type="primary">确定</el-button>
                <el-button class="el-icon-refresh" @click="refresh" type="success" plain></el-button>
                <el-button class="el-icon-document" @click="makeExcel"></el-button>
            </el-col>
        </el-row>
        <el-row>
            <el-col>
                <el-table :data="stockGoodsList">
                    <el-table-column type="index" :index="indexMethod"></el-table-column>
                    <el-table-column property="account" label="仓库名"></el-table-column>
                    <el-table-column property="goods.goodsName" label="商品名"></el-table-column>
                    <el-table-column property="goods.meteriType" label="材料"></el-table-column>
                    <el-table-column property="goods.purity" label="品质"></el-table-column>
                    <el-table-column property="goods.unitPrice" label="价格/克"></el-table-column>
                    <el-table-column property="goods.weight" label="重量"></el-table-column>
                    <el-table-column property="goodsNum" label="数量"></el-table-column>
                </el-table>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="8" :offset="12">
                <div class="block">
                    <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="stockGoodsDTO.current"
                    :page-sizes="[5, 10, 20, 50]"
                    :page-size="stockGoodsDTO.size"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total">
                    </el-pagination>
                </div>
            </el-col>
        </el-row>
    </div>
</template>

<script>
export default {
    data() {
        return {
            stockGoodsDTO: {
                current: 1,
                size: 10,
                code: null,
                material: null,
                category: null,
                purity: null,
            },
            stockGoodsList: [],
            total: 0,
            baseVO:null,
            purities:[],
        }
    },
    mounted: function() {
        this.getAll()
        this.$axios.get("/base/allBase").then(res =>{
            this.baseVO = res.data.data;
        })
    },
    methods: {
        getAll() {
            this.stockGoodsDTO.code = null;
            this.stockGoodsDTO.material = null;
            this.stockGoodsDTO.category = null;
            this.stockGoodsDTO.purity = null;
            console.log(this.stockGoodsDTO)
            this.$axios.post("/stockManage/searchByCondition",this.stockGoodsDTO).then(res => {
                this.total = res.data.data.total;
                this.stockGoodsList = res.data.data.list;
                console.log(res.data)
            })
        },
        searchCondition(){
            this.stockGoodsDTO.current = 1
            this.$axios.post("/stockManage/searchByCondition",this.stockGoodsDTO).then(res => {
                this.total = res.data.data.list.length;
                this.stockGoodsList = res.data.data.list;
            })
        },
        indexMethod(index) {
            return index + 1;
        },
        changeMaterial(){
            this.stockGoodsDTO.purity = ""    
            for (const item of this.baseVO.materials) {
                if(this.stockGoodsDTO.material == item.type) {
                    this.purities = item.purities
                    return
                }
            }
        },
        refresh(){
            this.getAll()
        },
        handleSizeChange(val) {
            this.stockGoodsDTO.size = val
            this.getAll()
        },
        handleCurrentChange(val) {
            this.stockGoodsDTO.current = val
            this.getAll()
        },
        makeExcel(){
            var goodsList = []
            for(let i = 0; i < this.stockGoodsList.length; i++){
                goodsList.push(this.stockGoodsList[i].goods)
            }
            this.$axios.post("/stockManage/generateExcel",goodsList).then(res => {})
        }
    },
}
</script>

<style scoped>

</style>